<div class="layuimini-container">
    <form id="app-form" class="layui-form layuimini-form">
        
        <div class="layui-form-item">
            <label class="layui-form-label">科目名称</label>
            <div class="layui-input-block">
                <select name="sid" lay-verify="required" data-select="{:url('subjects.subjects/index')}" data-fields="id,title">
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">标题</label>
            <div class="layui-input-block">
                <input type="text" name="title" class="layui-input"  placeholder="请输入标题" value="">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label required">视频/图片</label>
            <div class="layui-input-block layuimini-upload">
                <input name="video_images" class="layui-input layui-col-xs6 urls" lay-verify="required" lay-reqtext="请上传视频/图片" placeholder="请上传视频/图片" value="">
                <div class="layuimini-upload-btn">
                    <span>
                        <a class="layui-btn" style="position: relative">
                              <input class="layui-col-xs6"  id="fileSelector" type="file" style="width: 110px;
    position: absolute;right: 0;opacity: 0.01;" accept>
                            <i class="fa fa-upload"></i> 上传
                        </a>
                    </span>
                    <span>
                        <a class="layui-btn layui-btn-normal" style="width: 110px;background: #fff;color: #000;">
                            <span>上传进度：</span>
                            <span class="progress"></span>
                        </a>
                    </span>
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">随机题目数</label>
            <div class="layui-input-block">
                <input type="text" name="rand_num" class="layui-input"  lay-verify="required" placeholder="请输入该课程学员考核的随机题目数量" value="">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">课程内容</label>
            <div class="layui-input-block">
                <textarea name="content" rows="20" class="layui-textarea editor" lay-verify="required"  placeholder="请输入课程内容">{$row.describe|raw|default=''}</textarea>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">题目分数</label>
            <div class="layui-input-block">
                <input type="text" name="score" lay-verify="required" class="layui-input"  placeholder="请输入题目分数" value="">
            </div>
        </div>
        <!--<div class="layui-form-item">-->
            <!--<label class="layui-form-label required">图片地址</label>-->
            <!--<div class="layui-input-block layuimini-upload">-->
                <!--<input name="images" class="layui-input layui-col-xs6"   placeholder="请上传图片地址" value="">-->
                <!--<div class="layuimini-upload-btn">-->
                    <!--<span><a class="layui-btn" data-upload="images" data-upload-number="one" data-upload-exts="png|jpg|ico|jpeg" data-upload-icon="image"><i class="fa fa-upload"></i> 上传</a></span>-->
                    <!--<span><a class="layui-btn layui-btn-normal" id="select_images" data-upload-select="images" data-upload-number="one" data-upload-mimetype="image/*"><i class="fa fa-list"></i> 选择</a></span>-->
                <!--</div>-->
            <!--</div>-->
        <!--</div>-->
        <div class="hr-line"></div>
        <div class="layui-form-item text-center">
            <button type="submit" class="layui-btn layui-btn-normal layui-btn-sm" lay-submit>确认</button>
            <button type="reset" class="layui-btn layui-btn-primary layui-btn-sm">重置</button>
        </div>
        <script src="__STATIC__/admin/js/txcos/cos-auth.min.js"></script>
        <script>
            (function () {
                // 请求用到的参数
                var Bucket = 'yssd-1302907021';
                var Region = 'ap-chengdu';
                var protocol = location.protocol === 'https:' ? 'https:' : 'http:';
                var prefix = protocol + '//' + Bucket + '.cos.' + Region + '.myqcloud.com/';
                // 对更多字符编码的 url encode 格式
                var camSafeUrlEncode = function (str) {
                    return encodeURIComponent(str)
                        .replace(/!/g, '%21')
                        .replace(/'/g, '%27')
                        .replace(/\(/g, '%28')
                        .replace(/\)/g, '%29')
                        .replace(/\*/g, '%2A');
                };
                // 计算签名
                var getAuthorization = function (options, callback) {
                    var url = "{:url('/admin/ajax/sts')}";
                    var xhr = new XMLHttpRequest();
                    xhr.open('GET', url, true);
                    xhr.onreadystatechange = function (e) {
                        if (xhr.readyState === 4) {
                            if (xhr.status === 200) {
                                var credentials;
                                try {
                                    credentials = (new Function('return ' + xhr.responseText))().credentials;
                                } catch (e) {}
                                if (credentials) {
                                    callback(null, {
                                        XCosSecurityToken: credentials.sessionToken,
                                        Authorization: CosAuth({
                                            SecretId: credentials.tmpSecretId,
                                            SecretKey: credentials.tmpSecretKey,
                                            Method: options.Method,
                                            Pathname: options.Pathname,
                                        })
                                    });
                                } else {
                                    console.error(xhr.responseText);
                                    callback('获取签名出错');
                                }
                            } else {
                                callback('获取签名出错');
                            }
                        }
                    };
                    xhr.send();
                };

                // 上传文件
                var uploadFile = function (file, callback) {
                    var Key = file.name; // 这里指定上传目录和文件名
                    getAuthorization({Method: 'POST', Pathname: '/'}, function (err, info) {
                        var fd = new FormData();
                        fd.append('key', Key);
                        fd.append('signature', info.Authorization);
                        fd.append('Content-Type', '');
                        info.XCosSecurityToken && fd.append('x-cos-security-token', info.XCosSecurityToken);
                        fd.append('file', file); // file 字段放在表单最后，避免文件内容过长影响签名判断和鉴权
                        var url = prefix;
                        var xhr = new XMLHttpRequest();
                        xhr.open('POST', url, true);
                        xhr.upload.onprogress = function (e) {
                            $('.progress').html((Math.round(e.loaded / e.total * 10000) / 100) + '%');
                        };
                        xhr.onload = function () {
                            if (Math.floor(xhr.status / 100) === 2) {
                                var ETag = xhr.getResponseHeader('etag');
                                callback(null, {url1: prefix + camSafeUrlEncode(Key).replace(/%2F/g, '/'), ETag: ETag});
                            } else {
                                callback('文件 ' + Key + ' 上传失败，状态码：' + xhr.status);
                            }
                        };
                        xhr.onerror = function () {
                            callback('文件 ' + Key + ' 上传失败，请检查是否没配置 CORS 跨域规则');
                        };
                        xhr.send(fd);
                    });
                };
                // 监听表单提交
                document.getElementById('fileSelector').onchange = function (e) {
                    var file = document.getElementById('fileSelector').files[0];
                    if (!file) {
                        document.getElementById('msg').innerText = '未选择上传文件';
                        return;
                    }
                    file && uploadFile(file, function (err, data) {
                        $('.urls').val(data.url1)
                    });
                };
            })();
        </script>
    </form>
</div>